.customer-service {
    width: 360px;
    height: 120px;
    position: fixed;
    bottom: 10px;
    right: 50px;
    z-index: 9999;
}

.customer-service .img-wrap {
    position: fixed;
    bottom: 210px;
    right: 15px;
    z-index: 9999;
    width: 50px;
    height: 48px;
}

.customer-service .img-wrap img.kf {
    width: 50px;
    height: 48px;
    cursor: pointer;
}

.customer-service .img-wrap img.arrow {
    width: 50px;
    height: 48px;
    cursor: pointer;
    visibility: hidden;
    margin-top: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
}

.customer-service .img-wrap img.arrow.show {
    visibility: visible;
}

.customer-service .img-wrap .qrImg {
    width: 258px;
    position: absolute;
    top: 0;
    right: 55px;
    visibility: hidden;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 20px 64px 0 rgba(0, 0, 0, 0.10);
    padding: 10px;
}

.customer-service .img-wrap .qrImg .qrImg-wrap {
    background: #f7f7f7;
    border-radius: 8px;
    display: inline-block;
    width: 238px;
    height: 92px;
}

.customer-service .img-wrap .qrImg.show {
    visibility: visible;
}

.customer-service .img-wrap .qrImg .left {
    display: block;
    margin-top: 5px;
    float: left;
}

.customer-service .img-wrap .qrImg .left,
.customer-service .img-wrap .qrImg .left img {
    width: 83px;
    height: 80px;
}

.customer-service .img-wrap .qrImg .right {
    display: inline-block;
    width: 141px;
    height: 108px;
    position: relative;
    top: -10px;
}

.customer-service .img-wrap .qrImg .right .title {
    margin: 20px 0 10px 10px;
    text-align: left;
}

.customer-service .img-wrap .qrImg .right .sub-title {
    margin-left: 10px;
}